<div id="" class="field formio-component formio-component-form  formio-component-label-hidden" ref="component">
  <div class="formio-form formio-read-only ui form" ref="webform" novalidate>
    <div id="email" class="field form-group has-feedback formio-component formio-component-email formio-component-email " ref="component">
      <label class="" for="email-email">
        Email
      </label>
      <div ref="element">
        <div class="ui input fluid ">
          <input ref="input" name="data[email]" type="email" class="form-control" lang="en" disabled="disabled" spellcheck="true" value="" id="email-email"></input>
        </div>
      </div>
      <div ref="messageContainer"></div>
    </div>
    <div id="phoneNumber" class="field form-group has-feedback formio-component formio-component-phoneNumber formio-component-phoneNumber " ref="component">
      <label class="" for="phoneNumber-phoneNumber">
        Phone Number
      </label>
      <div ref="element">
        <div class="ui input fluid ">
          <input ref="input" name="data[phoneNumber]" type="text" class="form-control" lang="en" inputmode="decimal" disabled="disabled" spellcheck="true" value="" id="phoneNumber-phoneNumber"></input>
        </div>
      </div>
      <div ref="messageContainer"></div>
    </div>
    <div id="address" class="field form-group has-feedback formio-component formio-component-address formio-component-address " ref="component">
      <label class="" for="address-address">
        Address
      </label>
      <div class="address-autocomplete-container">
        <input ref="searchInput" name="data[address]" type="text" class="form-control" lang="en" tabindex="0" disabled="disabled" value="" autocomplete="off" aria-label="autocomplete">
        <i class="address-autocomplete-remove-value-icon fa fa-times" tabindex="0" ref="removeValueIcon"></i>
      </div>
      <div ref="messageContainer"></div>
    </div>
    <div id="dateTime" class="field form-group has-feedback formio-component formio-component-datetime formio-component-dateTime " ref="component">
      <label class="" for="dateTime-dateTime">
        Date Time
      </label>
      <div ref="element">
        <div class="ui input fluid  right labeled">
          <input ref="input" name="data[dateTime]" type="text" class="form-control" lang="en" disabled="disabled" value="" id="dateTime-dateTime"></input>
          <div class="ui label" ref="suffix">
            <i ref="icon" class="fa fa-calendar" style=""></i>
          </div>
        </div>
      </div>
      <div ref="messageContainer"></div>
    </div>
    <div id="day" class="field form-group has-feedback formio-component formio-component-day formio-component-day " ref="component">
      <label class="" for="day-day">
        Day
      </label>
      <div class="ui grid">
        <div class="five wide column">
          <label for="day-month" class="">Month</label>
          <select ref="month" class="ui search dropdown" id="day-month" class="form-control" name="month" lang="en">
            <option value=''>
            </option>
            <option value='1'>
              January
            </option>
            <option value='2'>
              February
            </option>
            <option value='3'>
              March
            </option>
            <option value='4'>
              April
            </option>
            <option value='5'>
              May
            </option>
            <option value='6'>
              June
            </option>
            <option value='7'>
              July
            </option>
            <option value='8'>
              August
            </option>
            <option value='9'>
              September
            </option>
            <option value='10'>
              October
            </option>
            <option value='11'>
              November
            </option>
            <option value='12'>
              December
            </option>
          </select>
          <input type="text" class="formio-select-autocomplete-input" ref="autocompleteInput" tabindex="-1" />
        </div>
        <div class="four wide column">
          <label for="day-day" class="">Day</label>
          <div class="ui input fluid ">
            <input ref="day" id="day-day" class="form-control formio-day-component-day" type="number" placeholder="" step="1" min="1" max="31" id="day-day"></input>
          </div>
        </div>
        <div class="seven wide column">
          <label for="day-year" class="">Year</label>
          <div class="ui input fluid ">
            <input ref="year" id="day-year" class="form-control formio-day-component-year" type="number" placeholder="" step="1" min="1900" max="2030" id="day-day"></input>
          </div>
        </div>
      </div>
      <input name="data[day]" type="hidden" class="form-control" lang="en" value="" ref="input">
      <div ref="messageContainer"></div>
    </div>
    <div id="time" class="field form-group has-feedback formio-component formio-component-time formio-component-time " ref="component">
      <label class="" for="time-time">
        Time
      </label>
      <div ref="element">
        <div class="ui input fluid ">
          <input ref="input" name="data[time]" type="time" class="form-control" lang="en" disabled="disabled" spellcheck="true" value="" id="time-time"></input>
        </div>
      </div>
      <div ref="messageContainer"></div>
    </div>
    <div id="currency" class="field form-group has-feedback formio-component formio-component-currency formio-component-currency " ref="component">
      <label class="" for="currency-currency">
        Currency
      </label>
      <div ref="element">
        <div class="ui input fluid ">
          <input ref="input" name="data[currency]" type="text" class="form-control" lang="en" disabled="disabled" inputmode="decimal" value="" id="currency-currency"></input>
        </div>
      </div>
      <div ref="messageContainer"></div>
    </div>
    <div id="resource" class="field form-group has-feedback formio-component formio-component-resource formio-component-resource " ref="component">
      <label class="" for="resource-resource">
        Resource
      </label>
      <select ref="selectContainer" class="ui search dropdown" name="data[resource]" type="text" class="form-control" lang="en" disabled="disabled" id="resource-resource"></select>
      <input type="text" class="formio-select-autocomplete-input" ref="autocompleteInput" tabindex="-1" />
      <div ref="messageContainer"></div>
    </div>
    <div id="resourceAdd" class="field form-group has-feedback formio-component formio-component-resource formio-component-resourceAdd formio-component-multiple " ref="component">
      <label class="" for="resourceAdd-resourceAdd">
        Resource Add
      </label>
      <select ref="selectContainer" class="ui search dropdown" multiple name="data[resourceAdd]" type="text" class="form-control" lang="en" disabled="disabled" id="resourceAdd-resourceAdd"></select>
      <input type="text" class="formio-select-autocomplete-input" ref="autocompleteInput" tabindex="-1" />
      <div ref="messageContainer"></div>
    </div>
    <div id="signature" class="field form-group has-feedback formio-component formio-component-signature formio-component-signature  required formio-component-label-hidden signature-pad" ref="component">
      <label class=" field-required control-label--hidden"></label>
      <div ref="element">
        <div class="ui input fluid ">
          <input ref="input" name="data[signature]" type="hidden" class="form-control" lang="en" disabled="disabled" value="No" id="signature-signature"></input>
        </div>
        <div class="signature-pad-body" style="width: 100%;height: 150px;padding:0;margin:0;" tabindex="0" ref="padBody">
          <a class="ui basic button mini icon signature-pad-refresh" ref="refresh">
            <i class="fa fa-refresh"></i>
          </a>
          <canvas class="signature-pad-canvas" height="150px" ref="canvas"></canvas>
          <span class="form-control-feedback field-required-inline text-danger">
    <i class="fa fa-asterisk"></i>
  </span>
          <img style="width: 100%;display: none;" ref="signatureImage">
        </div>
        <div class="signature-pad-footer">
          Sign above
        </div>
      </div>
      <div ref="messageContainer"></div>
    </div>
    <div id="tags" class="field form-group has-feedback formio-component formio-component-tags formio-component-tags " ref="component">
      <label class="" for="tags-tags">
        Tags
      </label>
      <div ref="element">
        <div class="ui input fluid ">
          <input ref="input" name="data[tags]" type="text" class="form-control" lang="en" disabled="disabled" value="" id="tags-tags"></input>
        </div>
      </div>
      <div ref="messageContainer"></div>
    </div>
    <div id="survey" class="field form-group has-feedback formio-component formio-component-survey formio-component-survey " ref="component">
      <label class="" for="survey-survey">
        Survey
      </label>
      <table class="ui table striped celled">
        <thead>
          <tr>
            <th></th>
            <th style="text-align: center;">1</th>
            <th style="text-align: center;">2</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>A</td>
            <td style="text-align: center;">
              <input type="radio" name="data[survey][a]" value="1" id="survey-a-1" ref="input">
            </td>
            <td style="text-align: center;">
              <input type="radio" name="data[survey][a]" value="2" id="survey-a-2" ref="input">
            </td>
          </tr>
          <tr>
            <td>B</td>
            <td style="text-align: center;">
              <input type="radio" name="data[survey][b]" value="1" id="survey-b-1" ref="input">
            </td>
            <td style="text-align: center;">
              <input type="radio" name="data[survey][b]" value="2" id="survey-b-2" ref="input">
            </td>
          </tr>
        </tbody>
      </table>
      <div ref="messageContainer"></div>
    </div>
    <div id="location" class="field form-group has-feedback formio-component formio-component-location formio-component-location " ref="component">
      Unknown component: location
      <div ref="messageContainer"></div>
    </div>
    <div id="submit" class="field form-group has-feedback formio-component formio-component-button formio-component-submit  form-group" ref="component">
      <button ref="button" class="ui button primary " name="data[submit]" type="submit" class="btn btn-primary btn-md" lang="en" disabled="disabled">
        Submit
      </button>
      <div ref="buttonMessageContainer">
        <span class="help-block" ref="buttonMessage"></span>
      </div>
      <div ref="messageContainer"></div>
    </div>
  </div>
  <div ref="messageContainer"></div>
</div>